@import "../../common.scss";

.mescroll {
	padding-top: ws(44);
}

.mui-icon {
	color: #414141;
}

.mui-bar-nav {
	height: unset;
	box-shadow: unset;
	background-color: #fff;
}

.mui-bar-nav .header {
	position: relative;
	.mui-title {
		line-height: ws(44);
	}
}

.header-wapper {
	display: flex;
	align-items: center;
	height: ws(44);
}

.content {
	.header-title{
		color: $main-color;
		font-size: ws(25);
		padding-left: ws(15);
		margin-bottom: ws(20);
	}
	.swiper {
		.swiper-wrapper {
			height: ws(390/2);
			.swiper-slide {
				padding: 0 ws(15);
				padding-bottom: ws(15);
				.swiper-img {
					width: 100%;
					height: ws(380/2);
					object-fit: cover;
					opacity: 0.8;
					box-shadow: 0 ws(3/2) ws(15) 0 rgba(24, 127, 217, 0.2);
					border-radius: ws(10);
				}
			}
		}

		.swiper-pagination-bullet-active {
			background-color: #FFFFFF;
		}
	}
	.list {
		padding: 0 ws(15);
		padding-top: ws(40);
		.item {
			padding: ws(15);
			box-shadow: 0 ws(3/2) ws(15) 0 rgba(24, 127, 217, 0.2);
			border-radius: ws(7);
			display: flex;
			margin-bottom: ws(40);
			.left {
				flex: 1;
				display: flex;
				align-items: flex-start;
				.icon {
					width: ws(12);
					height: ws(12);
					margin-right: ws(10);
					margin-top: ws(4);
				}
				.desc {
					flex: 1;
					.title {
						height: ws(40);
						display: -webkit-box;
						-webkit-box-orient: vertical;
						-webkit-line-clamp: 2;
						overflow: hidden;
					}
					.info {
						margin-top: ws(15);
						padding-top: ws(10);
						display: flex;
						justify-content: space-between;
						position: relative; 
						&::after {
								position: absolute;
								content: '';
								top: 0;
								left: 0;
								height: 1px;
								width: 100%;
								background-color: #eee;
						}
					}
				}
			}
			.right {
				width: ws(180/2);
				height: ws(180/2);
				background-color: #a9a9a9;
				border-radius: ws(7);
				margin-left: ws(15);
				margin-top: ws(-40);
				overflow: hidden;
				>img {
					width: 100%;
					height: 100%;
					object-fit: cover;
					border-radius: ws(7);
				}
			}
		}
	}
}
